<style lang="scss" scoped>
	.content {

		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.tip {
		color: #98A5B3;
		padding: 0 30rpx;
		width: 100%;
	}

	.nav {
		width: 100%;
		position: fixed;
		top: 0;
		left: 0;
	}

	.top {
		padding: 20rpx 0;
	}

	.search {
		width: 690rpx;
		height: 68rpx;
		background: #f4f5f7;
		border: 2rpx solid #f5f5f5;
		border-radius: 46rpx;
		margin: 0rpx auto;
		padding: 20rpx;

		.ipt {
			flex: 1;
		}
	}

	.footer {
		width: 100%;
		background-color: white;
		position: fixed;
		bottom: 0;
		left: 0;
		border-top: 1px solid #cccccc;
		padding-left: 30rpx;
		padding-right: 30rpx;
		z-index: 100;
	}

	.box {
		width: 690rpx;
		padding: 30rpx 20rpx;
		background: #ffffff;
		border-radius: 20rpx;
		box-shadow: 0rpx 32rpx 20rpx -20rpx #e6ebf2;
		margin-top: 30rpx;

		.line {
			width: 100%;
			height: 100rpx;
			border-top: 1px solid #eeeeee;

			.ipt {
				width: 500rpx;
				text-align: right;
			}
		}

		.line2 {
			width: 100%;
			border-top: 1px solid #eeeeee;
			align-items: flex-start;

			.des {
				width: 500rpx;
				text-align: justify;
			}
		}

		.sbtn {
			width: 184rpx;
			height: 64rpx;
			background: #fffefe;
			border: 2rpx solid #409eff;
			border-radius: 34rpx;
		}

		.imgboxs {
			width: 100%;
			flex-wrap: wrap;

			.imgbox {
				width: 148rpx;
				height: 148rpx;
				border: 2rpx solid #dee2ee;
				border-radius: 10rpx;
				position: relative;
				margin-right: 18rpx;

				.photo {
					width: 100%;
					height: 100%;

				}

				.close {
					position: absolute;
					width: 32rpx;
					height: 32rpx;
					right: -16rpx;
					top: -16rpx;
				}
			}

			.imgbox:nth-child(4n) {

				margin-right: 0rpx;
			}
		}
	}

	.btns {
		.btn {

			padding: 10rpx 30rpx;
			border: 2rpx solid #409eff;
			border-radius: 34rpx;
		}
	}

	.sbtn {
		width: 176rpx;
		height: 88rpx;
		border: 2rpx solid #dee2ee;
		border-radius: 46rpx;
	}

	.lbtn {
		width: 690rpx;

	}

	.gray {
		position: relative;
	}

	.red {
		position: absolute;
		top: 0rpx;
		left: -10rpx;
	}
</style>

<template>
	<view class="content">
		<view class="tip between-flex m-top30 f28">
			<view>创建人:{{user}}</view>
			<view>创建时间: {{date/1000 | alltime}}</view>
		</view>

		<view class="box" style="padding-bottom: 0;">
			<view class="textColor f32 bold p-bottom30">预定信息</view>
			<view class="line2 between-flex f28 p-top20">
				<view class="gray"><span class="red">*</span>会议主题</view>
				<textarea class="des textColor" style="height:120rpx;" v-model="title" maxlength="-1" placeholder="请输入"
					placeholder-class="gray" />

			</view>
			<view class="line2 between-flex f28 p-top20">
				<view class="gray">会议议题</view>
				<textarea class="des textColor" style="height:120rpx;" v-model="subject" maxlength="-1"
					placeholder="请输入" placeholder-class="gray" />

			</view>
			<view class="line between-flex f28">
				<view class="gray"><span class="red">*</span>会议类型</view>
				<picker mode="selector" :range="meetingTypeArr" range-key="name" @change="choose">
					<view class=" blue choosearea">
						{{meetType?meetType.name:'请选择'}}
						<u-icon name="arrow-right" color="#409EFF" size="28"></u-icon>
					</view>
				</picker>
			</view>
			<view class="line between-flex f28 c999">
				<view class=" ">会议室</view>
				<view class="">{{meetingInfo.name}}
				</view>
			</view>
			<view class="line between-flex f28 c999">
				<view class=" ">会议地址</view>
				<view class="">{{meetingInfo.address}}
				</view>
			</view>
			<view class="line between-flex f28">
				<view class="gray"><span class="red">*</span>会议时间</view>
				<view class="blue" @click="$navTo(PagesHuiYiRouterConfig.ChooseTime+'?date='+meetingDate+'&id='+id)">
					<span
						v-if="meetingTime.length>0">{{meetingTime[0].startTime}}-{{meetingTime[meetingTime.length-1].endTime}}</span>
					<span v-else>请选择</span>
					<u-icon name='arrow-right'></u-icon>
				</view>
			</view>
			<view class="line between-flex f28">
				<view class="gray">主持人</view>
				<view class="blue align-flex"
					@click="peopleType=1;!leaderperson?$navTo(PagesCourseRouterConfig.ChoosePerson+'?type=2'):$navTo(PagesCourseRouterConfig.ChoosePerson+'?type=2&users='+leaderperson.value)">
					<span v-if="!leaderperson||!leaderperson.value">请选择</span>
					<span v-else class=" align-flex">
						<view style="max-width:370rpx;" class="one">{{leaderperson.value | users}}</view>

					</span>
					<u-icon name='arrow-right'></u-icon>
				</view>
			</view>
			<!-- <view class="line between-flex f28">
				<view class="gray"><span class="red">*</span>参会人数（单位：人）</view>
				<input type="number" class="ipt" placeholder="请输入" style="width:300rpx;" />

			</view> -->
			<view class="line between-flex f28">
				<view class="gray">参会人员</view>
				<view class="blue align-flex"
					@click="peopleType=0;!addperson?$navTo(PagesCourseRouterConfig.ChoosePerson):$navTo(PagesCourseRouterConfig.ChoosePerson+'?users='+addperson.value)">
					<span v-if="!addperson||!addperson.value">请选择</span>
					<span v-else class=" align-flex">
						<view style="max-width:370rpx;" class="one">{{addperson.value | users}}</view>
						等{{addperson.value.split(',').length}}人
					</span>
					<u-icon name='arrow-right'></u-icon>
				</view>
			</view>
		</view>
		<view class="box " style="padding-bottom: 0;">
			<view class="between-flex m-bottom30">
				<view class="f32 bold textColor">更多信息</view>
				<view class="align-flex f28">

					<u-switch v-model="checked" active-color="#409EFF" inactive-color="#DEE2EE"></u-switch>

				</view>
			</view>
			<view class="" v-if="checked">
				<view class="line between-flex f28 ">
					<view class="gray">所属项目</view>
					<view class="blue" @click="$navTo(PagesHuiYiRouterConfig.ChooseProject)">
						{{project?project.name:'请选择'}}
						<u-icon name='arrow-right'></u-icon>
					</view>
				</view>
				<view class="line between-flex f28 ">
					<view class="gray">审批人</view>
					<view class="blue align-flex"
						@click="peopleType=2;!doneperson?$navTo(PagesCourseRouterConfig.ChoosePerson+'?type=2'):$navTo(PagesCourseRouterConfig.ChoosePerson+'?type=2&users='+doneperson.value)">
						<span v-if="!doneperson||!doneperson.value">请选择</span>
						<span v-else class=" align-flex">
							<view style="max-width:370rpx;" class="one">{{doneperson.value | users}}</view>

						</span>
						<u-icon name='arrow-right'></u-icon>
					</view>
				</view>
				<view class="line between-flex f28">
					<view class="gray"><span class="red">*</span>联系人</view>
					<input type="text" class="ipt" v-model="username" placeholder="请输入联系人姓名" />

				</view>
				<view class="line between-flex f28">
					<view class="gray"><span class="red">*</span>联系电话</view>
					<input type="text" class="ipt" v-model="phoneNumber" placeholder="请输入联系电话" />

				</view>
			</view>

		</view>


		<view class="space"></view>
		<view class="footer center-flex paddingBottom">

			<view class="lbtn" @click="submit">提交</view>
		</view>
	</view>
</template>

<script>
	import PagesCourseRouterConfig from '@/pagesCourse/routerConfig.js'
		import PagesHuiYiRouterConfig from  '@/pagesHuiyi/routerConfig.js'
	export default {
		data() {
			return {
				PagesCourseRouterConfig,
				PagesHuiYiRouterConfig,
				navheight: 0,
				head: this.$head,
				checked: true,
				user: uni.getStorageSync('username'),
				date: new Date().getTime(),
				meetingDate: '',
				id: '',//会议室ID
				meetingId:'',//编辑会议的ID
				meetingInfo: {},
				peopleType: 0, //0参与人1主持人2审核人
				addperson: '', //参与人
				leaderperson: '', //主持人
				doneperson: '', //审核人
				meetingTypeArr: uni.getStorageSync('dic').meeting_type,
				meetType: null,
				title: '',
				subject: '',
				meetingTime: [],
				project: null,
				username: uni.getStorageSync('username'),
				phoneNumber: uni.getStorageSync('phone')



			}
		},
		onLoad(e) {
			if(e.hasOwnProperty('type')){
				this.meetingId=e.meetingId
				this.getInfo()
			}else{
				this.id = e.id
				this.meetingDate = e.date
				this.getMeetingInfo()
				this.reset()
			}
			
			uni.$on('choosePerson', (data) => {
				if (this.peopleType == 1) {
					this.leaderperson = data
				} else if (this.peopleType == 2) {
					this.doneperson = data
				} else if (this.peopleType == 0) {
					this.addperson = data
				}
			})
			uni.$on('chooseMeetingTime', data => {
				this.meetingTime = data
			})
		},
		beforeDestroy() {
			uni.$off('choosePerson')
			uni.$off('chooseMeetingTime')
		},
		methods: {
			getInfo() {//获取编辑的预渲染数据
				this.$pop.ajaxPost('/bus/busMeeting/getById', {
					id: this.meetingId
				}).then(res => {
					var info=res.body
					this.meetingTime=info.meetingTimes
					this.id=info.meetingRoomId
					this.title=info.title
					this.subject=info.subject
					this.meetingDate=info.time.substring(0,10)
					var arr= uni.getStorageSync('dic').meeting_type
					var type={}
					arr.forEach(item=>{
						if(item.value==info.type){
							type=item
						}
					})
					this.meetType=type
					this.$forceUpdate()
					 this.getMeetingroom()
				
						
					if( info.itemCode){
						this.getProject(info.itemCode)
					}
					if (info.hosts) {
						var hostName=[]
						var hostValue=[]
						info.hosts.forEach(item=>{
							hostName.push(item.userName)
							hostValue.push(item.user)
						})
						this.leaderperson = {
							name:hostName.join(','),
							value:hostValue.join(',')
						}
					}
					if (info.attends) {
						var attendsName=[]
						var attendsValue=[]
						info.attends.forEach(item=>{
							attendsName.push(item.userName)
							attendsValue.push(item.user)
						})
						this.addperson = {
							name:attendsName.join(','),
							value:attendsValue.join(',')
						}
					}
					if (info.audits) {
						var auditsName=[]
						var auditsValue=[]
						info.audits.forEach(item=>{
							auditsName.push(item.userName)
							auditsValue.push(item.user)
						})
						this.doneperson = {
							name:auditsName.join(','),
							value:auditsValue.join(',')
						}
					}
				})
			},
			getMeetingroom() {
				this.$pop.ajaxPost('/bus/busMeetingRoom/getById', {
					id: this.id
				}).then(res => {
					this.meetingInfo = res.body
				})
			},
			
			getProject(itemCode) {
				this.$pop.ajaxPost('/busItemInfo/getPage', {
					pageNum: 1,
					pageSize: 1,
					temp: 'all',
					query: itemCode
				}).then(res => {
					this.project = res.body.list[0]
				})
			},
			submit() {
				if (!this.title) {
					this.$msg('请输入会议主题！')
					return
				}

				if (this.meetingTime.length == 0) {
					this.$msg('请选择会议时间')
					return
				}
				let meetingPersons = [{
					person: this.username,
					phone: this.phoneNumber
				}]
				let meetingUsers = []
				if(this.leaderperson){
					
					meetingUsers.push({
						type: 1,
						user: this.leaderperson.value
					})
				}
				if(this.addperson){
					let addperson=this.addperson.value.split(',')
					addperson.forEach(item => {
						meetingUsers.push({
							type: 3,
							user: item
						})
					})
					
				}
				if(this.doneperson){
					meetingUsers.push({
						type: 2,
						user: this.doneperson.value
					})
				}
				
				let meetingTime=[]
				this.meetingTime.forEach(item=>{
					meetingTime.push({
						startTime:item.startTime,
						endTime:item.endTime,
						id:item.id
					})
				})
				var obj = {
					title: this.title,
					time: this.meetingDate,
					subject: this.subject,
					type: this.meetType.value,
					meetingRoomId: this.id,
					itemCode:  this.project?this.project.value:'',
					meetingUsers:JSON.stringify(meetingUsers),
					meetingPersons:JSON.stringify(meetingPersons),
					meetingTime:JSON.stringify(meetingTime),

				}
				var url='/bus/busMeeting/add'
				if(this.meetingId){//编辑模式
					url="/bus/busMeeting/update"
					obj.id=this.meetingId
				}
				uni.showLoading({
					title: '提交中...',
					mask: true
				})
				this.$pop.ajaxPost(url, obj).then(res=>{
					uni.hideLoading()
					if (res.code == 0) {
						uni.showModal({
							title: '操作成功',
							success: () => {
								uni.navigateBack({
					
								})
							}
						})
					
					
					} else {
						this.$msg(res.msg)
					}
				})

			},
			reset() {
				this.meetType = this.meetingTypeArr[0]
			},
			choose(e) {
				this.meetType = this.meetingTypeArr[e.detail.value]
			},
			getMeetingInfo() {
				this.$pop.ajaxPost('/bus/busMeetingRoom/getById', {
					id: this.id
				}).then(res => {
					this.meetingInfo = res.body
				})
			}

		}
	}
</script>
